<div class="turboper" fxFlexFill>
  <div class="turboper-panel" fxLayout="column" fixFlexFill (mouseenter)="enterPower()" (mouseleave)="leavePower()">
    <div class="turboper-title">
      <span><i class="icon"></i>{{title}}</span>
    </div>
    <div class="turboper-progress">
      <ul class="sidelist">
        <li fxLayout="row" *ngFor="let item of totalTurboperDatas let i = index">
          <span class="fl turboper-progress-title" [title]="item?.name">{{item?.name}}</span>
          <div [ngStyle]="{color:item?.color}">
            <span class="bar fl" [ngStyle]="{background:item?.color,width:item?.value/maxValue*70+'%'}"></span>
            <em class="fl txt" [ngStyle]="{color:item.color}">{{item?.value | number:'1.0-2'}}</em>
          </div>
        </li>
      </ul>
    </div>
  </div>
  <!--*ngIf="powerShow"-->
  <div class="wrap-wind-details" [@fadeIn]="powerShow" *ngIf="powerShow">
    <div class="wind-details">
      <table cellspacing="0" cellpadding="0" class="turboper-table" style="white-space: normal;">
        <caption>
          {{title}}详情
        </caption>
        <tr>
          <th *ngFor="let item of turboperTable?.title let i =index">
          <span>
              {{item}}
          </span>
          </th>
        </tr>
        <tr *ngFor="let row of turboperTable?.rows let i =index" class="row2">
          <td *ngFor="let column of row.columns ">
          <span>
            {{column?.value?.value===undefined?column.value:column?.value?.value | number:'1.0-2'}}
          </span>
          </td>
        </tr>
      </table>
    </div>
  </div>
</div>
